<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<title>订单管理-经销商申请</title>
		<meta name="keywords" content="">
		<meta name="description" content="">
		<link rel="stylesheet" href="layui/css/layui.css">
		<script type="text/javascript" src="js/plugin/jquery-2.1.0.min.js"></script>
		<script type="text/javascript" src="js/plugin/jquery.i18n.properties.min.js"></script>
		<script src="layui/layui.js">
		</script>
	</head>

	<body class="page-body">
		<!--contentBegin-->
		<div class="layui-fluid">
			<span class="layui-breadcrumb" lay-separator=">">
			  <a href="">首页</a>
			  <a href="">国际新闻</a>
			  <a href="">亚太地区</a>
			</span>
		</div>
		<div id="content">
			<form class="layui-form" action="">
				<div class="layui-form-item">
					<div class="layui-inline">
						<label class="layui-form-label">范围</label>
						<div class="layui-input-inline" style="width: 100px;">
							<input type="text" name="price_min" placeholder="￥" autocomplete="off" class="layui-input">
						</div>
						<div class="layui-form-mid">-</div>
						<div class="layui-input-inline" style="width: 100px;">
							<input type="text" name="price_max" placeholder="￥" autocomplete="off" class="layui-input">
						</div>
					</div>

					<div class="layui-inline">
						<label class="layui-form-label">密码</label>
						<div class="layui-input-inline" style="width: 100px;">
							<input type="password" name="" autocomplete="off" class="layui-input">
						</div>
					</div>
					<div class="layui-inline">
						<label class="layui-form-label">日期时间</label>
						<div class="layui-input-inline">
							<input class="layui-input" id="test5" placeholder="yyyy-MM-dd HH:mm:ss" type="text">
						</div>
						<label class="layui-form-label">验证手机</label>
						<div class="layui-input-inline">
							<input name="phone" lay-verify="required|phone" autocomplete="off" class="layui-input" type="tel">
						</div>
					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">自定义验证</label>
						<div class="layui-input-inline">
							<input name="password" lay-verify="pass" placeholder="请输入密码" autocomplete="off" class="layui-input" type="password">
						</div>
						<div class="layui-form-mid layui-word-aux">请填写6到12位密码</div>
					</div>
					<div class="layui-form-item">
						<div class="layui-inline">
							<label class="layui-form-label">普通选择框</label>
							<div class="layui-input-inline">
								<select name="quiz2">
									<option value="">请选择市</option>
									<option value="杭州">杭州</option>
									<option value="宁波" disabled="">宁波</option>
									<option value="温州">温州</option>
									<option value="温州">台州</option>
									<option value="温州">绍兴</option>
								</select>
							</div>
						</div>
						<div class="layui-inline">
							<label class="layui-form-label">分组选择框</label>
							<div class="layui-input-inline">
								<select name="quiz">
									<option value="">请选择问题</option>
									<optgroup label="城市记忆">
										<option value="你工作的第一个城市">你工作的第一个城市</option>
									</optgroup>
									<optgroup label="学生时代">
										<option value="你的工号">你的工号</option>
										<option value="你最喜欢的老师">你最喜欢的老师</option>
									</optgroup>
								</select>
							</div>
						</div>
						<div class="layui-inline">
							<label class="layui-form-label">搜索选择框</label>
							<div class="layui-input-inline">
								<select name="modules" lay-verify="required" lay-search="">
									<option value="">直接选择或搜索选择</option>
									<option value="1">layer</option>
									<option value="2">form</option>
									<option value="3">layim</option>
									<option value="4">element</option>
									<option value="5">laytpl</option>
									<option value="6">upload</option>
									<option value="7">laydate</option>
									<option value="8">laypage</option>
									<option value="9">flow</option>
									<option value="10">util</option>
									<option value="11">code</option>
									<option value="12">tree</option>
									<option value="13">layedit</option>
									<option value="14">nav</option>
									<option value="15">tab</option>
									<option value="16">table</option>
									<option value="17">select</option>
									<option value="18">checkbox</option>
									<option value="19">switch</option>
									<option value="20">radio</option>
								</select>
							</div>
						</div>
					</div>
					<div class="layui-inline">
						<button class="layui-btn layui-btn-primary">原始按钮</button>
						<button class="layui-btn">默认按钮</button>
						<button class="layui-btn layui-btn-normal">百搭按钮</button>
						<button class="layui-btn layui-btn-warm">暖色按钮</button>
						<button class="layui-btn layui-btn-danger">警告按钮</button>
						<button class="layui-btn layui-btn-disabled">禁用按钮</button>
					</div>
				</div>
		</div>
		</form>
		<div <div class="ibox-content">
			<table class="table-hide" id="demoTable" lay-data="{id: 'idApply'}" lay-filter="Apply"></table>
		</div>
	</body>
	<script type="text/html" id="titleTpl">
		{{# if(d.status === 1){ }} 启用 {{# } else if(d.status === 2){ }} 禁用 {{# } }}
	</script>
	<script type="text/html" id="titleTpl2">
		{{# if(d.status === 1){ }} 减少 {{# } else if(d.status === 2){ }} 赠送 {{# } else if(d.status === 3){ }} 增加 {{# } else if(d.status === 4){ }} {{# } else if(d.status === 5){ }} {{# } }}
	</script>
	<script type="text/html" id="titleTpl3">
		{{# if(d.installment === 1){ }} 是 {{# } else if(d.installment === 2){ }} 否 {{# } }}
	</script>
	<script type="text/html" id="titleTpl4">
		{{# if(!(d.accountTime)){ }} {{# } else { }} {{formatDate(new Date(d.accountTime))}} {{# } }}
	</script>
	<script type="text/javascript">
		$(function() {
			//注意：导航 依赖 element 模块，否则无法进行功能性操作
			layui.use('element', function() {
				var element = layui.element;
				element.init();
				element.init('breadcrumb');
				element.render('nav');
				element.render('tab');
				//…
			});
			layui.use('laydate', function() {
				var laydate = layui.laydate;

				//日期时间选择器
				laydate.render({
					elem: '#test5',
					type: 'datetime',
					lang: 'en' //控制语言
				});
			});
			layui.use('table', function() {
				var table = layui.table;
				var tableIns = table.render({
					elem: '#demoTable',
					url: 'showApply',
					id: 'idApply',
					cellMinWidth: 120,
					page: true,
					cols: [
						[{
								field: '',
								type: 'checkbox',
								title: 'ID',
								sort: true,
								fixed: 'left'
							},
							{
								title: '序号',
								templet: '#indexTpl',
								width: 120
							},
							{
								field: 'purchasesNum',
								'title': '采购单号',
								width: 120,
								sort: true
							},
							{
								field: 'operator',
								'title': '运营商',
								width: 120,
								sort: true,
								edit: 'text'
							},
							{
								field: 'dest',
								'title': '归属地',
								width: 200,
								sort: true,
								edit: 'text'
							},
							{
								fixed: 'right',
								title: '操作',
								align: 'center',
								width: 200,
								toolbar: '#barTools'
							}
						]
					],
				});
				var $ = layui.$,
					active = {
						reload: function() {
							table.reload('idApply', {
								where: {
									/* 	               	 activityName : $("#activityName").val(),
										            	 timeS : $("#timeS").val(),
										            	 timeE : $("#timeE").val(),
										            	 activityType : $("select[id=activityType]").get(0).selectedIndex,
										            	 status : $("select[id=status]").get(0).selectedIndex,
										            	 installment : $("select[id=installment]").get(0).selectedIndex */
								}
							});
						}
					};
				//监听搜索查询
				$('#search').on('click', function() {
					var type = $(this).data('type');
					active[type] ? active[type].call(this) : '';
				});

				//监听批量删除按钮
				$('#btn_del').on('click', function() {
					layer.confirm('确认是否删除', function(index) {
						layer.close(index);
						var checkStatus = table.checkStatus('idRule'); //idRule即为基础参数id对应的值
						if(checkStatus.data.length != 0) {
							var chk_value = [];
							for(var i = 0; i < checkStatus.data.length; i++) {
								chk_value.push(checkStatus.data[i].id);
							}
							var param = {
								"titles": chk_value
							};
							$.ajax({
								type: "POST",
								url: "deleteRuleBySelect",
								data: param,
								success: function(data) {}
							});
							//表格重载
							tableIns.reload({
								where: { //设定异步数据接口的额外参数，任意设
									/* 			               	 activityName : $("#activityName").val(),
												            	 timeS : $("#timeS").val(),
												            	 timeE : $("#timeE").val(),
												            	 activityType : $("select[id=activityType]").get(0).selectedIndex,
												            	 status : $("select[id=status]").get(0).selectedIndex,
												            	 installment : $("select[id=installment]").get(0).selectedIndex */
								},
								page: {
									curr: 1 //重新从第 1 页开始
								}
							});
						} else {
							layer.msg("请选择至少一条数据");
						}
					});
				});
				//监听批量启用禁用按钮
				$("button[name='updatestat']").on('click', function() {
					var checkStatus = table.checkStatus('idRule'); //idRecharge即为基础参数id对应的值
					if(checkStatus.data.length != 0) {
						var chk_value = [];
						var statu = 0;
						for(var i = 0; i < checkStatus.data.length; i++) {
							chk_value.push(checkStatus.data[i].id);
						}
						var param = {
							"titles": chk_value,
							"status": $(this).val()
						};
						$.ajax({
							type: "POST",
							url: "updateRuleStatus",
							data: param,
							success: function(data) {}
						});
						tableIns.reload({
							where: { //设定异步数据接口的额外参数，任意设
								/* 			               	 activityName : $("#activityName").val(),
											            	 timeS : $("#timeS").val(),
											            	 timeE : $("#timeE").val(),
											            	 activityType : $("select[id=activityType]").get(0).selectedIndex,
											            	 status : $("select[id=status]").get(0).selectedIndex,
											            	 installment : $("select[id=installment]").get(0).selectedIndex */
							},
							page: {
								curr: 1 //重新从第 1 页开始
							}
						});
					} else {
						layer.msg("请选择至少一条数据");
					}
					//console.log(checkStatus.data) //获取选中行的数据
					//console.log(checkStatus.data.length) //获取选中行数量，可作为是否有选中行的条件
				});

				//监听单元格编辑
				table.on('edit(Rule)', function(obj) {
					var value = obj.value, //得到修改后的值
						data = obj.data, //得到所在行所有键值
						field = obj.field; //得到字段
					layer.msg('[ID: ' + data.id + '] ' + field + ' 字段更改为：' + value);
					$.ajax({
						type: "POST",
						url: "editRule",
						data: "value=" + value + "&field=" + field + "&id=" + data.id,
						success: function(data) {

						},
						error: function(date) {
							layer.msg("失败");
						}
					});
				});

				//监听工具条
				table.on('tool(Rule)', function(obj) {
					var data = obj.data;
					var checkStatus = table.checkStatus('idRule');
					console.log(checkStatus.data);
					if(obj.event === 'del') {
						layer.confirm('确认是否删除', function(index) {
							var chk_value = [data.id];
							var param = {
								"titles": chk_value
							};
							$.ajax({
								type: "POST",
								url: "deleteRuleBySelect",
								data: param,
								success: function(data) {}
							});
							obj.del();
							layer.close(index);
						});
					} else if(obj.event === 'updatestat') {
						var chk_value = [];
						var statu = 0;
						chk_value.push(data.id);
						statu = data.status == 1 ? 2 : 1;
						var param = {
							"titles": chk_value,
							"status": statu
						};
						$.ajax({
							url: "updateRuleStatus",
							type: "post",
							data: param,
							async: false,
							dataType: "json",
							success: function(date) {}
						});
						tableIns.reload({
							where: { //设定异步数据接口的额外参数，任意设
								/* 		               	 activityName : $("#activityName").val(),
										            	 timeS : $("#timeS").val(),
										            	 timeE : $("#timeE").val(),
										            	 activityType : $("select[id=activityType]").get(0).selectedIndex,
										            	 status : $("select[id=status]").get(0).selectedIndex,
										            	 installment : $("select[id=installment]").get(0).selectedIndex */
							},
							page: {
								curr: 1 //重新从第 1 页开始
							}
						});
					}
				});
			});
		})
	</script>
	<script type="text/html" id="indexTpl">
		{{d.LAY_TABLE_INDEX+1}}
	</script>
	<script type="text/html" id="barTools">
		<a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="updatestat1">确认订单</a>
		<a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="updatestat3">驳回</a>
		<a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="updatestat4">通过</a>
		<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
	</script>

</html>